<template>
  <div class="AddOrUpdate_main add_container column_two">
    <div class="main_main">
      <el-form ref="form" :model="formData" :rules="rules" :inline="true">
        <el-form-item label="报修单号" prop="code" class="repairs">
          <el-input v-model="formData.code" placeholder="暂无" disabled />
        </el-form-item>
        <el-form-item v-model="formData.standingBookId" label="报修设备" prop="bookName">
          <el-input v-model="formData.bookName" placeholder="暂无" disabled />
        </el-form-item>
        <el-form-item v-model="formData.deviceStatusCode" label="设备状态" prop="deviceStatusLabel">
          <el-input v-model="formData.deviceStatusLabel" placeholder="暂无" disabled />
        </el-form-item>
        <el-form-item label="设备故障时间" prop="malfunctionTime">
          <el-input v-model="formData.malfunctionTime" placeholder="暂无" disabled />
        </el-form-item>
        <el-form-item label="期望修复时间" prop="expectedTime">
          <el-input v-model="formData.expectedTime" placeholder="暂无" disabled />
        </el-form-item>
        <el-divider />
        <el-form-item v-model="formData.typeId" label="故障类型" prop="typeName">
          <el-input v-model="formData.typeName" placeholder="暂无" disabled />
        </el-form-item>
        <el-form-item v-model="formData.emergencyDegree" label="紧急程度" prop="emergencyDegreeLabel">
          <el-input v-model="formData.emergencyDegreeName" placeholder="暂无" disabled />
        </el-form-item>
        <el-form-item v-model="formData.reportPersonId" label="报修人员" prop="reportPersonName">
          <el-input v-model="formData.reportPersonName" placeholder="暂无" disabled />
        </el-form-item>
        <el-form-item label="故障情况拍照" class="double">
          <FileManageFull
            :file-names.sync="formData.docName"
            :file-real-names.sync="formData.docRealName"
            :file-urls.sync="formData.docUrl"
            :readonly="true"
          />
        </el-form-item>
        <el-form-item label="附件" class="double">
          <FileManageFull
            :file-names.sync="formData.fileName"
            :file-real-names.sync="formData.fileRealName"
            :file-urls.sync="formData.fileUrl"
            :readonly="true"
          />
        </el-form-item>
        <el-form-item label="故障现象" prop="double">
          <el-input v-model="formData.phenomenon" type="textarea" placeholder="暂无" disabled />
        </el-form-item>
        <el-divider />
        <el-form-item label="维修人员" prop="repairPersonName">
          <el-input v-model="formData.repairPersonName" placeholder="暂无" disabled />
        </el-form-item>
        <el-form-item label="计划修复时间范围" prop="planTime" class="double">
          <el-input v-model="formData.planTime" placeholder="暂无" disabled />
        </el-form-item>
      </el-form>
    </div>
  </div>
</template>

<script>
import { addOrUpdate, getInfo, personnellist } from '@/api/equipmentManage/equipmentRepair/repairAssignment'
export default {
  name: 'AddOrUpdate',
  props: {
    layerid: {},
    id: {},
    defaultValue: {}
  },
  data() {
    return {
      formData: {
        isSubmit: 1,
        id: undefined,
        code: undefined,
        name: undefined,
        roleIdsArray: undefined,
        roleIds: undefined,
        bookName: undefined,
        deviceStatusCode: undefined,
        malfunctionTime: undefined,
        expectedTime: undefined,
        typeName: undefined,
        emergencyDegreeCode: undefined,
        reportPersonName: undefined,
        phenomenon: undefined,
        emergencyDegreeLabel: undefined,
        deviceStatusLabel: undefined,
        standingBookId: undefined,
        typeId: undefined,
        reportPersonId: undefined,
        planTime: undefined,
        repairPersonName: undefined,
        emergencyDegree: undefined,
        emergencyDegreeName: undefined,
        docName: '',
        docRealName: '',
        docUrl: '',
        fileName: '',
        fileRealName: '',
        fileUrl: ''
      },
      num: 1,
      roleOptions: [],
      userOptions: [],
      rules: {
        name: [
          { required: true, message: '租户名称不能为空', trigger: 'change' }
        ]
      }
    }
  },
  created() {
    this.getList()
    if (!this.id) { // 没有id就是新增
      Object.keys(this.defaultValue).forEach(key => { // 给右边数据赋值
        this.formData[key] = this.defaultValue[key]
      })
    } else { // 有id就是编辑
      this.getInfo()
      this.getList()
    }
  },
  methods: {
    getInfo() {
      getInfo(this.id).then(res => {
        Object.keys(this.formData).forEach(key => { // 给右边数据赋值
          this.formData[key] = res.data[key]
        })
        this.formData.roleIdsArray = this.formData.roleIds.split(',')
      })
    },
    getList() {
      personnellist(this.formData).then(res => {
        this.userOptions = res.data
      })
    },
    onSubmit() {
      this.$refs['form'].validate(valid => {
        if (valid) {
          this.formData.roleIds = this.formData.roleIdsArray
          this.formData.isSubmit = 4
          addOrUpdate(this.formData).then(res => {
            this.$message({
              message: res.msg,
              type: 'success'
            })
            this.$layer.close(this.layerid) // 关闭弹框
            this.$parent.refresh() // 调用父组件的刷新方法
          })
        }
      })
    },
    cancel() {
      this.$layer.close(this.layerid)// 关闭弹框
    }
  }
}
</script>

<style lang="less" scoped>

.main_main{
  /deep/ .el-form-item__label{
    width: 140px !important;
  }
  /deep/ .el-form-item__content{
    width: calc(100% - 140px) !important;
  }
}
</style>
